import { Card, Table, Button,Tabs } from 'antd'
import AuthButton from '@/components/authButton'
import api from '@/framework/axios'//请求接口的封装
import Util from '@/util/util'
import less from './index.less';

const TabPane = Tabs.TabPane;


class MessageList extends React.Component {
  state = {
    loading: false,
    parentIds: [],
    dataSource: {},
    selectedRowKeys: [],
    modal: {
      show: false,
    }
  }

  params = {
    pageSize: 10,
    page: 1
  }



  componentWillMount() {
    console.log('即将挂载')
    this.tableSearch()
  }

  tableSearch = () => {
    let _this = this;
    if (this.state.loading) return false;//如果加载中退出
    this.setState({
      loading: true,
    })

    api.ajax('GET', '@/message/list', {
      ...this.params,
    }).then(r => {
      this.setState({
        loading: false,
        selectedRowKeys: [],
        dataSource: r,
        pagination: Util.pageination(r, (current) => {
          _this.params.page = current;
          _this.tableSearch();
        }, (current, pageSize) => {
          _this.params.page = current;
          _this.params.pageSize = pageSize;
          _this.tableSearch();
        })
      })
    }).catch(r => {
      this.setState({
        loading: false,
      })
    })
  }

  componentDidMount() {

  }

  componentWillUnmount() {
    console.log('生命结束即将挂载')
  }

  handleToAdd = () => {
    this.props.history.push('/message/messageAdd/2132302929823');

  }

  handleToDetails = (id) => {

  }

  columns = () => {
    let _this = this;
    return [{
      title: '消息类型',
      dataIndex: 'type',
      key: 'type',
      width: 200
    }, {
      title: '标题',
      dataIndex: 'title',
      key: 'title',
      width: 200
    }, {
      title: '内容',
      dataIndex: 'content',
      key: 'content',
      width: 200
    }, {
      title: '状态',
      dataIndex: 'status',
      key: 'status',
      width: 200
    }, {
      title: '发布时间',
      dataIndex: 'plubicTime',
      key: 'plubicTime',
      width: 200
    }, {
      title: '操作',
      width: 200,
      key: 'id1',
      render: (text, record) => (
        <span>
          <a href="javascript:void(0)" onClick={() => this.handleToDetails(record.id)}>查看</a>
        </span>
      ),
    }]
  }

  render() {
    const { selectedRowKeys } = this.state;
    const rowCheckSelection = {
      type: 'checkbox',
      selectedRowKeys,
      onChange: (selectedRowKeys) => {
        this.setState({
          selectedRowKeys
        })
      }
    }
    return (
      <Card>
        <Tabs defaultActiveKey="1" type="card">
          <TabPane tab="网站公告" key="1">
            <Table
              {...ComponentDefine.table_}
              rowKey="id"
              pagination={this.state.pagination}
              loading={this.state.loading}
              dataSource={this.state.dataSource.result}
              rowSelection={rowCheckSelection}
              columns={this.columns()}
            />
          </TabPane>
          <TabPane tab="系统消息" key="2">
            <Table
              {...ComponentDefine.table_}
              rowKey="id"
              pagination={this.state.pagination}
              loading={this.state.loading}
              dataSource={this.state.dataSource.result}
              rowSelection={rowCheckSelection}
              columns={this.columns()}
            />
          </TabPane>
        </Tabs>

      </Card>
    )
  }
}
export default MessageList